<template>
	<view class="" style="padding-bottom: 80rpx;box-sizing: border-box;">

		<view class="Good_S" style="">
			<view class="bg-image">
				<image :src="baseUrl +hosipitalInfo.cover_img"></image>
			</view>
			<view class="frame">
				<view class="frame_top">

					<view class="frame_top_title">

						{{hosipitalInfo.name}}
					</view>
					<view class="diswods">
						<view class="S_display">{{ hosipitalInfo.rank+'医院' }}</view>
						<view class="A_display">{{ hosipitalInfo.type }}</view>
						<view class="N_display">{{ hosipitalInfo.nature }}</view>
					</view>
				</view>
				<view class="frame_bottom">
					<u-read-more ref="uReadMore" showHeight="150" :toggle="true">
						<rich-text :nodes="hosipitalInfo.text" @load="load"
							style="line-height: 50rpx;color: #000;font-size: 26rpx;text-indent: 0em;font-weight: 400;"></rich-text>
					</u-read-more>
					<!-- <view v-html="hosipitalInfo.text ?hosipitalInfo.text :'暂无介绍'"></view> -->
				</view>
			</view>
			<!-- <view class="query_btn">
				<button open-type="contact" size="mini" style="padding: 0;margin:0;border-radius: 10rpx;">
					<view class="btn">问诊咨询</view>
				</button>
			</view> -->
			<view class="" style="display: flex;margin-bottom: 15rpx;margin-left: 30rpx;">
				<view class=""
					style="width: 8rpx;height: 25rpx;background-color: #37c1c4;border-radius: 10rpx;margin-top: 10rpx;margin-right: 5rpx;">
				</view>
				<text style="letter-spacing: 5rpx;">热门服务</text>
			</view>

			<view class="shopbox" v-for="item in indexList1" :key="item.name" @click="godlist(item)">
				<view class="">
					<image :src="baseUrl +item.logo" mode=""
						style="width: 120rpx;height: 120rpx;"></image>
				</view>
				<view class="shopboxright">
					<view class="" style="display: flex;flex-direction: column;margin-top: 5rpx;">
						<text style="font-weight: 600;font-size: 29rpx;letter-spacing: 5rpx;">{{ item.name }}</text>
						<text style="font-size: 24rpx;font-weight: 300;margin-top: 4rpx;">{{ item.text }}</text>
					</view>
					<view class="" style="margin-top: 25rpx; font-size: 24rpx;display: flex;">
						<view class="textN">
							<text style="color: #999; ">{{ item.describe }}</text>
						</view>

						<view class="" style="margin-left: 45rpx; width: 180rpx;">

							<text
								style="font-size: 30rpx;color: red;margin-top: -10rpx;">￥{{ item.common_price }}</text>
							/次

						</view>
					</view>
				</view>
			</view>

		</view>

	</view>
	</view>
</template>
<script>
	export default {
		data() {
			return {
				//医院id
				hospitalId: null,
				//服务列表
				serviceList: [],
				hosipitalInfo: {

				},
				indexList1: [

				],
				goodsId: '',
				text: ``,
				https:'',
				baseUrl:''
			}
		},
		onLoad(options) {
			this.hospitalId = options.id
			this.baseUrl=this.https
		},
		onShow() {
			console.log(this.https,"////////////////////////")
			this.getServiceList()
			this.hospital()
		},
		methods: {

			getServiceList() {
				this.post('/api/Zrecduzp/huoquzhidingidyiyuandexiangxixinxi', {
					id: this.hospitalId
				}).then((res) => {
					this.hosipitalInfo = res;
					console.log(res, '什么东西');
					this.text = res.text;
					console.log(this.text, '什么东西1');
					this.$nextTick(() => {
						this.$refs.uReadMore.init();
					})

				})


			},
			// 医院服务
			hospital() {
				this.post('/api/Zrecduzp/hospitalService', {
					id: this.hospitalId
				}).then((res) => {

					this.indexList1 = res
				})
			},

			// uni.navigateTo({
			// 	url: '/pages/HomePage/centerInner/diagnosis?id=' + val
			// });
			// console.log(val);
			godlist(val) {
				this.goodsId = val.id;
				console.log(val);
				// return
				
				if (!uni.getStorageSync('user_id')) {
					uni.switchTab({
						url: '/pages/My/My'
					});
					return;
				}

				uni.navigateTo({
					url: '/pages/HomePage/centerInner/diagnosis?id=' + val.id
				});
				// if(val.name=='护工陪护'||val.name=='异地陪诊'){
				// 	uni.navigateTo({
				// 		url: '/pages/HomePage/Aubordinate/order_buy?id=' +this.goodsId  + '&smallname=' + val.name
				// 	});
				// }else if(val.name=='代办跑腿' ||val.name=='产康服务' || val.name=='全程陪诊'){
				// 	uni.navigateTo({
				// 		url: '/pages/HomePage/Aubordinate/worker?id=' +this.goodsId  + '&smallname=' + val.name
				// 	});
				// }else{
				// 	uni.navigateTo({
				// 		url: '/pages/HomePage/Aubordinate/Pregnancy?id=' +this.goodsId  + '&smallname=' + val.name
				// 	});
				// }


			}



		},



	}
</script>
<style lang="scss">
	/* 选项栏样式 */
	.Good_S {
		height: 730rpx;

	}

	.bg-image {
		image {
			width: 100%;
		}
	}

	.frame {
		position: relative;
		top: -100rpx;
		display: flex;
		flex-direction: column;
		width: 650rpx;
		margin: 0 auto;
		border: 2rpx solid #FFFFFF;
		border-radius: 30rpx;
		background-color: #FFFFFF;
	}

	.frame_top {
		width: 650rpx;
		height: 140rpx;
		border-bottom: 2rpx dashed #424F5E;
		border-radius: 30rpx 30rpx 0 0;

		.frame_top_title {
			margin: 40rpx 0 0 40rpx;
			color: #000000;
			height: 42rpx;
			font-size: 32rpx;
		}

		.diswods {
			display: flex;
			margin-left: 40rpx;
			margin-top: 10rpx;
			height: 32rpx;
			line-height: 32rpx;
			font-size: 24rpx;
			margin-bottom: 15rpx;

			.S_display {
				color: #5f5af7;
				margin-right: 20rpx;
			}

			.A_display {
				color: #FEC345;
				margin-right: 20rpx;
			}

			.N_display {
				color: #00D4D7;
			}
		}
	}

	.frame_bottom {
		width: 570rpx;
		overflow: scroll;
		margin: 20rpx 40rpx;
		font-size: 24rpx;
		color: #424F5E;
		line-height: 30rpx;

	}

	.query_btn {
		width: 100%;
		height: 170rpx;
		background: #FFFFFF;
		box-shadow: 0rpx 0rpx 20rpx 2rpx rgba(0, 0, 0, 0.1);
		position: fixed;
		left: 0;
		bottom: 0;
		display: flex;
		align-items: center;
		justify-content: center;

		.btn {
			width: 590rpx;
			height: 80rpx;
			background: #5F5AF7;
			border-radius: 10rpx;
			font-size: 36rpx;
			font-weight: bold;
			color: #FFFFFF;
			line-height: 80rpx;
			text-align: center;
		}
	}

	.shopbox {
		width: 686rpx;
		margin-left: 30rpx;
		padding: 30rpx 15rpx 20rpx 30rpx;
		background-color: #fff;
		box-sizing: border-box;
		margin-top: 15rpx;
		display: flex;
		border-radius: 14rpx;

		.shopboxright {
			margin-left: 20rpx;
		}
	}

	.textN {
		width: 250rpx;
		white-space: nowrap;
		/*2.溢出部分隐藏起来*/
		overflow: hidden;
		/*3.文字溢出的时候用省略号来显示*/
		text-overflow: ellipsis;

	}
</style>